import React, { useContext } from 'react';
/* 修改数据后重新渲染，组件变成响应式 */
import { observer } from 'mobx-react';
/* 引入 context 中包含 Mobx的数据 */
import { MyContext } from '../../storeMobx';
import { Button } from 'antd';

function TodoInput() {
  /* 拿到全局的 context store */
  const mobxStore = useContext(MyContext);

  console.log('mobxStore', mobxStore);

  return (
    <div>
      <h3>mobxStore 基础的使用</h3>
      <h3>{mobxStore.count}</h3>
      <Button
        type='primary'
        onClick={() => {
          console.log('mobxStore', mobxStore);
          mobxStore.increment();
        }}
      >
        修改mobxStore中的值 ++
      </Button>
    </div>
  );
}
export default observer(TodoInput);
